<template>
	<div class="threePage">
		<div class="explain">
			<p class="exp_title">
				<span>微信售票机用途之三：微信吸粉</span>
				<i></i>
			</p>
			<div class="explain_cont">
				<i><img src="../../assets/fiveuse/autosell-img3.png"></i>
				<ul>
					<li>
						<p>游客使用微信支付后，</p>
						<p>被<font>默认关注</font>景区公众号的应用</p>
						 
					</li>
					<li>
						<p>适用场景：景区现场自动售票、 </p>
						<p>景区周边的线下分销等</p>
					</li>
				</ul>
			</div>
		</div>
		 <div class="analyze">
		 	<p class="exp_title">
				<span>“吸粉”优势分析</span>
				<i></i>
			</p>
			<div class="analyze_cont">
				<ul>
					<li v-for="item in analyze_list">
						<i><img :src="item.IMG"></i>
						<p>{{item.title}}</p>
						<p>{{item.text}}</p>
					</li>
				</ul>
			</div>
		 </div>
		<Advance></Advance>
	</div>	
</template>

<script>

import Advance from '../../components/FiveUse/AdvanceOrder'
	export default{
		name:'onePage',
		components:{
			Advance
		},
		data(){
			return{
				analyze_list:[
					{
						IMG:require('../../assets/fiveuse/fans01.png'),
						title:'客流“数据化”',
						text:'搞清楚来的是谁、从哪里来、性别、年龄..... 营销推广更好做'
					},
					{
						IMG:require('../../assets/fiveuse/fans02.png'),
						title:'沟通更便捷',
						text:'借助购票过程自动建立与游客的沟通渠道，及时开展二次营销'
					},
					{
						IMG:require('../../assets/fiveuse/fans03.png'),
						title:'粉丝变成资源',
						text:'持续获利，也可视情况选择微信号托管给我们探索共享模式'
					}
				]
			}
		}
	}
</script>

<style scoped>
@media only screen and (min-width: 1000px){
	.threePage{
		width: 100%;
		margin-top: 70px;
	 
	}
	.explain{
		width: 1000px;
		margin: 0 auto;
	}
	.exp_title{
		text-align: center;
	}
	.exp_title span{
		font-size:26px;
		color: #4d4845;
		display: block;
	}
	.exp_title i{
		display: inline-block;
		width: 50px;
		height: 2px;
		background-color: #4d4845;
	}
	.explain_cont{
		width: 100%;
		overflow:hidden;
		margin-top:40px;
		margin-bottom: 95px;
	}
	.explain_cont i{
		display: inline-block;
		width:430px;
		height: 430px;
		float: left;
	}
	.explain_cont i img{
		width: 100%;
	}

	.explain_cont ul{
		display: inline-block;
		width: 500px;
		float: left;
	}
	.explain_cont ul li{
		float: left;
		width: 100%;
		text-align: center;
		
	}
	.explain_cont ul li p{
		margin-bottom: 20px;
	}
	.explain_cont ul li:nth-child(1){
		font-size: 18px;
		color:#4d4845;
		margin-top: 70px;
		 

	}
	.explain_cont ul li:nth-child(1) font{
		font-size: 24px;

	}
	.explain_cont ul li:nth-child(1) p{
		padding:0 40px;
	}
	.explain_cont ul li:nth-child(2){
		font-size: 18px;
		color:#00ade6;
		margin-top: 70px;
		
	}

	.analyze{
		width: 100%;
	}
	.analyze .analyze_cont{
		width: 1000px;
		margin:0 auto;
	}
	.analyze .analyze_cont ul{
		margin-top: 50px;
		margin-bottom: 100px;
		overflow: hidden;
	}
	.analyze .analyze_cont li{
		width: 33%;
		display:inline-block;
		text-align: center;
		float: left;
	}
	.analyze .analyze_cont li i{
		width: 99px;
		height: 99px;
		display: inline-block;
	}
	.analyze .analyze_cont li p{
		padding:0 50px;
		font-size: 14px;
		color: #666;
		margin-top: 20px;
		line-height: 25px;
	}
	.analyze .analyze_cont li p:nth-child(2){
		font-size: 18px;
		color: #4d4845;
	} 
}


</style>